<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<%@ include file="/web/header.jsp" %>
<title>图片维护</title>
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin:10px;padding:15px">
  <legend>图片维护</legend>
  <div class="layui-field-box">
     <button type="button" class="layui-btn" id="test1">
 	    <i class="layui-icon layui-icon-upload"></i>上传图片
	  </button>
	  <div class="layui-upload-list">
	    <table class="layui-table">
	      <thead>
	        <tr>
		        <th>文件名</th>
		        <th>图片</th>
		        <th>操作</th>
	        </tr>
	     </thead>
	      <tbody id="demoList"></tbody>
	    </table>
	  </div>
	  </div>
</fieldset>
<script type="text/javascript">
 var code='<%=request.getParameter("code")%>'
	 renderUpload('test1','/EmployeeUpload',{code:code},function(res,index,upload){
	 if(res.code==1){
		 layer.msg('上传成功')
		 showpic(res.image)//获得图片，调用方法展示
	 }
 })
 function showpic(image){//放在表格中展示
	 var html="<tr>"
	 +"<td>"+image+"</td>"
	 +"<td><img src='/image/"+image+"' alt='"+image+"' class='layui-upload-img'></td>"
	 +"<td><input type='button' value='删除' class='layui-btn' onclick='delpic()'></td>"
	 +"</tr>"
	 $("#demoList").html(html);//放在网页中
		//<img src>配置图片的虚拟路径，在server中配置	 
 }
 
 function delpic(){//删除图片 
	 openConfirm(function(){
		 ajax('/employee',{code:code,action:'delpic'},'text',function(data){
			 if(data=="1"){
				 layer.msg("删除成功")
				 $("#demoList").html('')
			 }else{
				 layer.msg("删除失败")
			 }
		 })
	 },"是否删除？")
 }
 init()//回显图片
 function init(){
	 ajax('/employee',{code:code,action:'get'},'json',function(data){
		 console.log(data)
		 var image=data.head;//取出图片
		 if(image)//如果图片存在，显示
			 showpic(image)
		 else $("#demoList").html('')
	 })
 }
 

</script>
</body>
</html>